<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册登录界面Ⅰ</title>
    <link rel="stylesheet" href="./css/reg.css">
    <script src="http://47.106.66.89:8080/js/vue.min.js"></script>
    <script src="http://47.106.66.89:8080/js/axios.min.js"></script>
    <link href="http://47.106.66.89:8080/js/ele-2.15.7/theme-chalk/index.css" rel="stylesheet">
    <script src="http://47.106.66.89:8080/js/ele-2.15.7/index.js"></script>
</head>
<body>
<div id="app">
    <div class="box" style="margin-left: 100px">
        <input type="text" placeholder="用户名" v-model="user.uname"><br>
        <span v-html="error.uname"></span><br>
        <input type="password" placeholder="密码" v-model="user.pwd"><br>
        <span v-html="error.pwd"></span><br>
        <input type="password" placeholder="请再次输入密码" v-model="user.repassword"><br>
        <span v-html="error.repassword"></span><br>
        <input type="email" placeholder="邮箱" v-model="user.email"><br>
        <span v-html="error.email"></span><br>
        <input type="text" placeholder="手机号码" v-model="user.phone"><br>
        <span v-html="error.photo"></span><br>
      <button @click="reg">注册</button>
        <button ><a href="login.html">返回登录</a></button>
    </div>
</div>
<script>
    let app=new Vue({
        el:"#app",
        data:{
            user:{uname:'',pwd:'',repassword:'',email:'',phone:''},
            error:{uname:'',pwd:'',repassword:'',email:'',phone:''},
        },
        methods:{
            reg(){
                axios.post("blog-user/userinfo/reg",this.user).then(res=>{
                  this.error={uname:'',pwd:'',repassword:'',email:'',phone:''};
                   if(res.data.code==1){
                       this.$message(res.data.message)
                   }else if(res.data.code==-1){
                       for (let dataKey in res.data.data) {
                           if(this.error[res.data.data[dataKey].field]==false) {
                               this.error[res.data.data[dataKey].field] = res.data.data[dataKey].defaultMessage + "<br>";
                           }
                       }
                   }else if(res.data.code==0){
                       this.$message(res.data.message);
                   }
                   this.user={uname:'',pwd:'',repassword:'',email:'',phone:''};
                })

            }
        },
        createds(){

        }

    })
</script>
</body>
</html>
